<template>
	<view class="bgccc">
		<u-toast ref="uToast" />
		<u-navbar back-text="返回" :background="background" title="个人中心"></u-navbar>
		<view class="u-p-30 u-flex u-row-between bgfff mb-20">
			<view class="">
				<u-avatar :src="userMsg.avatar" :size="80" :show-sex='true' mode="circle"
					:sex-icon="userMsg.gender==1?'man': userMsg.gender==0? 'woman':''"
					:show-level='userMsg.userLevel==1'></u-avatar>
				<view class="">
					<text> {{userMsg.username}} </text>
					<view>注册时间 {{userMsg.registerTime}}</view>
					<view>上次登录 {{loginTime}}</view>
				</view>
			</view>
			<view class="">
				<navigator url="../changeMsg/changeMsg">编辑资料</navigator>
			</view>
		</view>
		<view class="">
			<!-- 选项卡 -->
			<u-tabs :height="120" :list="[{name: '发布话题分类'}, {name: '我的收藏'}]" ref='tabs' :is-scroll="false"
				:current="current" @change="change" :bar-width='200'></u-tabs>
		</view>
		<swiper :indicator-dots="true" class="TopicChose" :current="swiperCurrent" @transition="transition"
			@animationfinish="animationfinish">
			<swiper-item class="swiper-item">
				<scroll-view scroll-y style="height: 100%;width: 100%;" >
					<view class="page-box">				
						<PostClass></PostClass>				
					</view>
				</scroll-view>
			</swiper-item>
			<swiper-item class="swiper-item">
				<scroll-view scroll-y style="height: 100%;width: 100%;" >
					<view class="page-box">
						<myCollection></myCollection>	
					</view>
				</scroll-view>
			</swiper-item>
			
		</swiper>
		<button type="default" @click="newPass">修改密码</button>
		<button type="default" @click="outLogin">退出登录</button>
		<footNav :currents='4'></footNav>
	</view>
</template>

<script>
	import footNav from '@/components/footNav/footNav.vue'
	import PostClass from '@/components/PostClass/PostClass'
	import myCollection from '@/components/myCollection/myCollection'
	import {
		mixins
	} from '@/public.js'
	export default {
		name:'Person',
		mixins: [mixins],
		components: {
			footNav,PostClass,myCollection
		},
		created() {
			this._m_gettitleMsg()
		},
		computed: {
			userMsg() {
				return JSON.parse(uni.getStorageSync('myMsg'))
			},
			loginTime() {//裁剪时间显示格式
				let arr = this.userMsg.loginTime.split(',')
				return arr[arr.length - 1]
			}
		},
		data() {
			return {
				postMsg:{
					title:'',
					body:'',
					imgUrl:"",
					
				},
				background: {
					backgroundImage: 'linear-gradient(45deg, rgb(28, 187, 180), rgb(141, 198, 63))'
				},
				current: 0,//当前选项页
				title: {},
				swiperCurrent: 0,//当前选项卡页
			}
		},
		methods: {
			postC(){
				this.postMsg.imgUrl=this.vuex_imgUrl
				this.$api.setNewClass(this.postMsg).then(
				   res=>{
					   if(res!==0){
						    this.$refs.uToast.show({
					  	duration: 3000,
					  	title: '发布成功',
					  	type: 'success',
					  });
					   }
					 
				   },
				   err=>{
					   console.log(err)
				   }
				
				)},
			outLogin() {
				this.$api.userOut().then(
					res => {
						if (res !== 0) {
							this.$refs.uToast.show({
								duration: 3000,
								title: '退出成功',
								type: 'warning',
								url: '/pages/Login/Login'
							});
						}
					}
				)
			},
			newPass() {
				this.$u.route({
					url: '/pages/changePassword/changePassword'
				})
			},
			getOrderList(idx) {
				
			},
			change(index) {//点击选项的回调
				this.current = index;
				this.swiperCurrent = index;
				
			},
			reachBottom() {
				// 此tab为空数据 下滑到底的操作
				if (this.current != 2) {		
					setTimeout(() => {
						this.swiperCurrent = index;
					}, 1200);
				}
			},
			transition({//选项卡切换动画
				detail: {
					dx
				}
			}) {

			},
			animationfinish({
				detail: {
					current
				}
			}) {
				this.swiperCurrent = current;
				this.current = current;
			},
		}
	}
</script>

<style lang="scss">
	.bg {
		background-color: #F5F8F7;
	}

	.bgfff {
		background-color: #fff;
	}

	.TopicChose {
		height: 90vh;
	}
</style>
